<template>
    <h2>状态</h2>
    <nav>
        <router-link to="/state/interactive">交互</router-link>
    </nav>
    <h2>布局</h2>
    <nav>
        <router-link to="/layout/aspect">比例</router-link>
        |
        <router-link to="/layout/columns">分列</router-link>
        |
        <router-link to="/layout/break">断点</router-link>
        |
        <router-link to="/layout/display">显示</router-link>
        |
        <router-link to="/layout/float">浮动</router-link>
        |
        <router-link to="/layout/clear">清除浮动</router-link>
        |
        <router-link to="/layout/isolate">隔离</router-link>
        |
        <router-link to="/layout/fit">拟合</router-link>
        |
        <router-link to="/layout/object-position">对象位置</router-link>
        |
        <router-link to="/layout/overflow">溢出</router-link>
        |
        <router-link to="/layout/overscroll">滚出</router-link>
        |
        <router-link to="/layout/position">位置</router-link>
        |
        <router-link to="/layout/inset">偏移</router-link>
        |
        <router-link to="/layout/visible">可见</router-link>
        |
        <router-link to="/layout/z-index">深度</router-link>
    </nav>
    <h2>柔性&网格</h2>
    <nav>
        <router-link to="/flex-grid/basis">基准</router-link>
        |
        <router-link to="/flex-grid/direction">方向</router-link>
        |
        <router-link to="/flex-grid/wrap">换行</router-link>
        |
        <router-link to="/flex-grid/flex">伸缩</router-link>
        |
        <router-link to="/flex-grid/grow">增大</router-link>
        |
        <router-link to="/flex-grid/shrink">缩小</router-link>
        |
        <router-link to="/flex-grid/order">排序</router-link>
        |
        <router-link to="/flex-grid/grid-cols">列数</router-link>
        |
        <router-link to="/flex-grid/col">跨列</router-link>
        |
        <router-link to="/flex-grid/grid-rows">行数</router-link>
        |
        <router-link to="/flex-grid/row">跨行</router-link>
        |
        <router-link to="/flex-grid/grid-flow">摆放</router-link>
        |
        <router-link to="/flex-grid/auto-cols">自动列宽</router-link>
        |
        <router-link to="/flex-grid/auto-rows">自动行高</router-link>
        |
        <router-link to="/flex-grid/gap">间隙</router-link>
        |
        <router-link to="/flex-grid/place">对齐</router-link>
    </nav>
    <h2>空间</h2>
    <nav>
        <router-link to="/spacing/p-m">边距</router-link>
        |
        <router-link to="/spacing/size">尺寸</router-link>
    </nav>
    <h2>效果</h2>
    <nav>
        <router-link to="/effects/mix-blend">混色</router-link>
    </nav>
</template>